// 开发环境配置
const { merge } = require('webpack-merge')
const common = require('./webpack.common')

module.exports = merge(common, {
  // 模式
  mode: "development",
  // 映射
  devtool: 'inline-source-map',
  module: {
    rules: [
      {
        test: /\.css$/i,
        use: ["style-loader", "css-loader"],
      },
      {
        test: /\.s[ac]ss$/i,
        use: [
          // 将 JS 字符串生成为 style 节点
          'style-loader',
          // 将 CSS 转化成 CommonJS 模块
          'css-loader',
          // 将 Sass 编译成 CSS
          'sass-loader',
        ],
      },
    ]
  },
  // 测试服务器
  devServer: {
    // open: true,
    // 中间件函数
    onBeforeSetupMiddleware({ app }) {
      // 拦截接口
      app.get('/api/list', (req, res) => {
        res.send({
          code: 200,
          data: [1, 2, 3, 4, 5]
        })
      })
    }
  }
})